<html>
    <body>
        <button id="login">
            登录
        </button>
    </body>

    <script>
        // 一开始存在 但是隐藏的登录窗口
        // var loginLayer = (function() {
        //     var div = document.createElement('div');
        //     div.innerHTML = 'login';
        //     div.style.display = 'none';
        //     document.body.appendChild(div);
        //     return div;
        // })();
        //
        // document.getElementById('login').onclick = function() {
        //     loginLayer.style.display = 'block';
        // };

        // 需要用的时候会被创建的登录浮窗
        // var createLoginLayer = function() {
        //     var div = document.createElement('div');
        //     div.innerHTML = 'login';
        //     div.style.display = 'none';
        //     document.body.appendChild(div);
        //     return div;
        // }

        // document.getElementById('login').onclick = function() {
        //     var loginLayer = createLoginLayer();
        //     loginLayer.style.display = 'block';
        // };

        // 需要用的时候会被创建的单例浮窗
        // var createLoginLayer = (function() {
        //     var div;
        //     if (!div) {
        //         var div = document.createElement('div');
        //         div.innerHTML = 'login';
        //         div.style.display = 'none';
        //         document.body.appendChild(div);
        //     }

        //     return div;
        // })();

        // document.getElementById('login').onclick = function() {
        //     var loginLayer = createLoginLayer();
        //     loginLayer.style.display = 'block';
        // };

        var getSingle = (fn) => {
            var res;
            return function() {
                return res || (res = fn.apply(this, arguments))
            }
        }

        var createLoginLayer = function() {
            var div = document.createElement('div');
            div.innerHTML = 'login';
            div.style.display = 'none';
            document.body.appendChild(div);
            return div;
        }

        var createSingleLoginLayer = getSingle(createLoginLayer)
        document.getElementById('login').onclick = function() {
            var loginLayer = createSingleLoginLayer();
            loginLayer.style.display = 'block';
        };

        // 给list绑定事件
        var bindEvent = getSingle(function() {
            document.getElementById('div1').addEventListener() = function() {
                console.log('click');
            };
            return true;
        })

        var render = function() {
            console.log('render list');
            bindEvent();
        }

        render();
        render();
        render();
    </script>
</html>